import Quick from ".";
import { WeaInput, WeaSelect, WeaLocaleProvider } from 'ecCom';
const { getLabel } = WeaLocaleProvider;

export default class Main extends Quick {
    state = {
        field: '',
        value: ''
    }
    getComponent = () => {
        const { field, value } = this.state;
        const viewAttrArr = [{
            key: '1',
            showname: '只读'
        }, {
            key: '2',
            showname: '可编辑'
        }, {
            key: '3',
            showname: '必填'
        }];
        return [
            <div>
                <WeaInput ecId={`${this && this.props && this.props.ecId || ''}_WeaInput@7mk106@$fieldname`}
                    style={{ width: 200 }}
                    placeholder={getLabel('511723','请输入字段名称')}
                    value={field}
                    onChange={v => this.setState({ field: v })}
                />
            </div>,
            <div style={{marginTop:8}}>
                <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@47g4ww@`}
                    style={{ width: 200 }}
                    options={viewAttrArr}
                    value={value}
                    showSearch={true}
                    optionFilterProp="children"
                    onChange={v => this.setState({ value: v })}
                    placeholder={getLabel('528641','请选择字段的状态') }
                />
            </div>
        ]
    }
    getTitle = () => {
        return 'excel.changeFieldAttr';
    }
    getScript = () => {
        return `excel.changeFieldAttr('${this.state.field}',${this.state.value});`
    }
}